<!DOCTYPE html>
<html lang="ch" xmlns:th="http://www.thymeleaf.org" />
<head>
    <th:block th:include="inc :: header('租方管理')"/>
</head>
<body>
    <table id="table" lay-filter="table"></table>
    <script type="text/html" id="editDelBar">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑数据</a>
        <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除数据</a>
    </script>
    <script type="text/html" id="toolbar">
        <div class="layui-btn-container">
            <a class="layui-btn layui-btn-sm" lay-event="add">新增数据</a>
        </div>
    </script>
    <script>
        var form;
        layui.use(['table','form'],function () {
            form = layui.form;
            var tb = layui.table;
            //加载表格
            tb.render({
                elem:'#table',
                url:'/guc/find',
                page:true,
                toolbar:'#toolbar',
                height:'full-0',
                cols:[
                    [
                        {type:'checkbox',flex:'left'},
                        {field:'name',title:'名称',align:'center',width:150},
                        {field:'sex',title:'性别',align:'center',width:100,
                            templet:function (res) {
                                if(res.sex=='1'){
                                    return '男';
                                }else{
                                    return '女';
                                }
                            }
                        },
                        {field:'idcard',title:'身份证件号码',align:'center',width:200},
                        {field:'mobile',title:'联系方式',align:'center',width:150},
                        {field:'userType',title:'租方角色',align:'center',width:150,
                            templet:function (res) {
                                var str = '';
                                if(res.con01>0){
                                    str += '<span style="color: red">出租方&nbsp;</span>'
                                }
                                if(res.con02>0){
                                    str += '<span style="color: green">&nbsp;承租方</span>'
                                }
                                return str;
                            }
                        },
                        {fixed:'right',title:'操作',align:'center',width:200,toolbar:'#editDelBar'}
                    ]
                ]
            });
            tb.on('toolbar(table)',function (obj) {
                switch (obj.event) {
                    case 'add':
                        openDig('新增租方数据','');
                       break;
                }
            });
            tb.on('tool(table)',function (obj) {
                //获取行数据
                var row = obj.data;
                switch (obj.event) {
                    case 'edit':
                        var id = row.id;
                        openDig('编辑租方数据',id)
                        break;
                    case 'del':
                        //确认框
                        layer.confirm('真的要删除该条记录</br>如果确定，数据就不能回复!',function (index) {
                           $.ajax({
                              type:'post',
                              url:'/guc/remove',
                              data:{
                                  id:row.id
                              } ,
                              dataType: 'json',
                              success:function (result) {
                                   layer.alert(result.msg);
                                   obj.del();//删除当前行
                              }
                           });
                        });
                        break;
                }
            })
        });
        function openDig(title,id){
            var url = '/guc/add';
            if(id!=''){
                id = "?id="+id;
                url = '/guc/edit';
            }
            layer.open({
                title:title,
                type:2,//默认0-信息框，1-页面，2-iframe
                maxmin:true,//是否显示最大化最小按钮
                content:'/guc/addEdit'+id,
                area:['30%','40%'],
                anim:5,
                btn:['确定保存','取消关闭'],
                btnAlign:'c',
                success:function(layero){
                    $(':focus').blur();
                    //给表单添加form标识
                    layero.addClass('layui-form');
                    //把确定保存按钮转为提交按钮
                    layero.find('.layui-layer-btn0').attr({
                        'lay-filter':'formBtn',
                        'lay-submit':''
                    });
                },
                yes:function(i,l){
                   var flat = false;
                   //TODO 表单验证没有实现
                   form.on('submit(*)',function (data) {
                       return false;
                   });

                   //获取表单
                   var f = layer.getChildFrame('form',i);
                   var data = f.serialize();
                   $.ajax({
                       type:'post',
                       url:url,
                       data:data,
                       dataType:'json',
                       success:function (result) {
                           layer.alert(result.msg);
                           if(result.is){
                               //关闭窗口
                               layer.close(i);
                               //刷新表格
                               layui.table.reload('table');
                           }
                       }
                   });
                },
                btn2:function (index,l) {
                    layer.alert("点击取消");
                }
            });
        }
    </script>
</body>
</html>